<?xml version="1.0" encoding="UTF-8"?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	template="/resources/layout/templateInterno.xhtml"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:t="http://myfaces.apache.org/tomahawk"
    xmlns:rich="http://richfaces.org/rich">
    
    <script type="text/javascript">
    jQuery(function($){    
        $("#inptCep").mask("999.999-999");    
    }); 
</script>
    
	<ui:define name="body">
		<div class="form">
		<h:form id="formCadastroIgreja">
		<h:panelGroup id="pgMensagens">
			<div class="grid-8-12">
			  <h:messages id="msIgrejaCadastro" style="color : red;padding-left : 8px" />
			</div>
		</h:panelGroup>
		<div  class="field-clear"></div>
		  <t:fieldset id="idfsDadosPessoais"  legend="Dados">
		  
				<div class="grid-4-12">
					<h:outputLabel  id="lbNome" class="form-lbl"  value="Nome:"/>
					<h:inputText  id="inptNome" styleClass="form-txt" required="true" requiredMessage="Favor informar o Username." value="#{usersCadastroBean.users.username}" />
				</div>
				<div class="grid-4-12">
					<h:outputLabel  id="lbEmail" class="form-lbl"  value="Email:"/>
					<h:inputText  id="inptEmail" styleClass="form-txt" required="true" requiredMessage="Favor informar o email." value="#{usersCadastroBean.users.username}" />
				</div>
				<div class="field-clear"></div>
				<div class="grid-4-12">
					<h:outputLabel  id="lbUsername" class="form-lbl"  value="Username:"/>
					<h:inputText  id="inptUsername" styleClass="form-txt" required="true" requiredMessage="Favor informar o Username." value="#{usersCadastroBean.users.username}" />
				</div>
				 <div class="field-clear"></div>
				<div class="grid-3-12">
							<h:outputLabel  id="lbIgreja"  class="form-lbl"  value="Igreja Frequenta:"/>
							<rich:comboBox required="true" requiredMessage="Favor informar a Igreja." defaultLabel="Selecione..."   id="cbIgreja" converter="comboboxConverter"  value="#{usersCadastroBean.users.igreja}">
								   <t:selectItems value="#{usersCadastroBean.listaIgrejas}" var="igreja" itemLabel="#{igreja.nome}" itemValue="#{igreja}"/>
							</rich:comboBox>					
					</div>
					<div class="grid-3-12">
							<h:outputLabel  id="lbAuthorities"  class="form-lbl"  value="Autorização:"/>
							<rich:comboBox required="true" requiredMessage="Favor informar o Autorização." defaultLabel="Selecione..." converter="comboboxConverter" width="170" id="cbAuthorities"  value="#{usersCadastroBean.authority}">
								   <t:selectItems value="#{usersCadastroBean.listaAuthority}" var="authority" itemLabel="#{authority.role}" itemValue="#{authority}"/>
								   <a4j:support ajaxSingle="true" event="onchange" reRender="pgExibirPickList"></a4j:support>
							</rich:comboBox>					
					</div>
				 <div class="field-clear"></div>
				 <h:panelGroup id="pgExibirPickList">
				 <h:panelGroup id="pgAutorizacao" rendered="#{usersCadastroBean.authority.authority eq 'ROLE_ADMIN_REGIONAL'}">
					 <div class="grid-10-12">
						<h:outputLabel  id="lbCep" class="form-lbl"  value="Igrejas:"/>
						         <rich:pickList  id="listaUnidadesSelecionadas" value="#{usersCadastroBean.listaIgrejasSelecionadas}"> 
				            <f:selectItems value="#{usersCadastroBean.listaSelctItensIgrejas}" />
				        </rich:pickList>	
					</div>
				</h:panelGroup>
				</h:panelGroup>
		 </t:fieldset>
		 <div style="padding: 20px" >
			 	<rich:dataTable style="width: 500px;" id="membroTable"  var="users" value="#{usersCadastroBean.listaUsers}" >
				  <f:facet  name="header">
                    <rich:columnGroup >
                            <rich:column style="text-align: left"  styleClass="ui-state-default" >
                                <strong><h:outputText value="Username" /></strong>
                            </rich:column>
                            <rich:column style="text-align: left"  styleClass="ui-state-default" >
                                <strong><h:outputText value="Igreja" /></strong>
                            </rich:column>
                    	</rich:columnGroup>
                  </f:facet>
 				<rich:columnGroup >	
 					<rich:column >
						<h:outputText value="#{users.username}" />
					</rich:column>		
					 <rich:column>
						<h:outputText value="#{users.igreja.nome}" />
					</rich:column>
					
				</rich:columnGroup>
			</rich:dataTable>
		</div>
			<div  class="field-clear"></div>
				<div style="text-align: center;" >
					<a4j:commandButton style="width:70px" ajaxSingle="true" process="idfsDadosPessoais" styleClass="form-button" id="cbSalvarIgreja" value="Salvar" reRender="pgMensagens,membroTable" action="#{usersCadastroBean.salvar}" >	</a4j:commandButton>
				</div >
		</h:form>
		</div>
	<t:saveState  value="#{usersCadastroBean.authority}"/>
	<t:saveState  value="#{usersCadastroBean.users}"/>
	<t:saveState  value="#{usersCadastroBean.listaSelctItensIgrejas}"/>
	<t:saveState  value="#{usersCadastroBean.listaSelctItensIgrejasSelecionada}"/> 
	</ui:define>
</ui:composition>

